<template>
  <div>
    <div :class="$style.header">
      <span :class="$style.title">单据号：</span>
      <span :class="$style.value">{{ purchaseHeadData.poNo }}</span>
    </div>

    <div :class="$style.wrap">
      <a-row :class="$style.craftHeadInfo">
        <a-col :class="$style.col" :span="8">
          <span :class="$style.label">创建人：</span>
          <span :class="$style.value">{{ purchaseHeadData.creator }}</span>
        </a-col>
        <a-col :class="$style.col" :span="8">
          <span :class="$style.label">单据类型：</span>
          <span :class="$style.value">采购订单</span>
        </a-col>
        <a-col :class="$style.col" :span="8">
          <span :class="$style.label">品牌：</span>
          <span :class="$style.value">{{ purchaseHeadData.brandName }}</span>
        </a-col>
        <a-col :class="$style.col" :span="8">
          <span :class="$style.label">产品名称：</span>
          <span :class="$style.value">{{ purchaseHeadData.productName }}</span>
        </a-col>
        <a-col :class="$style.col" :span="8">
          <span :class="$style.label">款号：</span>
          <span :class="$style.value">{{ purchaseHeadData.skcNo }}</span>
        </a-col>
        <a-col :class="$style.col" :span="8">
          <span :class="$style.label">CP 号：</span>
          <span :class="$style.value">{{ purchaseHeadData.cpNo }}</span>
        </a-col>
        <a-col :class="$style.col" :span="8">
          <span :class="$style.label">一级分类：</span>
          <span :class="$style.value">{{ purchaseHeadData.sortName }}</span>
        </a-col>
        <a-col :class="$style.col" :span="8">
          <span :class="$style.label">版本号：</span>
          <span :class="$style.value">{{ purchaseHeadData.cversion }}</span>
        </a-col>
        <a-col :class="$style.col" :span="8">
          <span :class="$style.label">创建时间：</span>
          <span :class="$style.value">{{ purchaseHeadData.createTime }}</span>
        </a-col>
        <a-col :class="$style.col" :span="8">
          <span :class="$style.label">预计交期</span>
          <span :class="$style.value">{{ purchaseHeadData.deliverTime }}</span>
        </a-col>
      </a-row>

      <div :class="$style.status">采购总价：{{ allPrice }}</div>
    </div>
  </div>
</template>

<script>
import API from './../../../api/craft'
export default {
  props: {
    totalPrice: {
      type: Number,
      default: 0
    }
  },
  data() {
    return {
      allPrice: 0,
      purchaseHeadData: {}
    }
  },
  mounted() {
    this.getCraftMaterialInfo()
    this.getPurchaseHeadInfo({
      taskId: this.$route.query.taskId // taskId
    })
  },
  methods: {
    async getCraftMaterialInfo() {
      if (!this.$route.query.quoteId) {
        this.allPrice = this.totalPrice
        return
      }
      const res = await API.craftMaterialInfo({
        taskId: this.$route.query.quoteId,
        productId: this.$route.query.productId
      })
      console.log(res)
      this.allPrice = res.allPrice
    },
    async getPurchaseHeadInfo({ taskId }) {
      const res = await this.$api.purchase.purchaseHeader({ taskId })

      this.purchaseHeadData = res
    }
  }
}
</script>

<style lang="less" module>
@import './header.less';
</style>
